<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>定时任务</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/static/admin/lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/admin/css/public.css" media="all">
</head>
<body>

<!-- 正文开始 -->
<div class="layui-card">
    <div class="layui-card-body">
        <!-- 表格工具栏 -->
        <form class="layui-form toolbar">
            <div class="layui-inline">
                <label class="layui-form-label">任务类型:</label>
                <div class="layui-input-inline">
                    <select name="protocol">
                        <option value="">选择类型</option>
                        <option value="HTTP">HTTP</option>
                        <option value="SHELL">SHELL</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">状&emsp;态:</label>
                <div class="layui-input-inline">
                    <select name="status">
                        <option value="">选择状态</option>
                        <option value="1">启用</option>
                        <option value="0">禁用</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">任务名称:</label>
                <div class="layui-input-inline">
                    <input name="search" class="layui-input" placeholder=""/>
                </div>
            </div>
            <div class="layui-inline">&emsp;
                <button class="layui-btn icon-btn" lay-filter="userTbSearch" lay-submit>
                    <i class="layui-icon">&#xe615;</i>搜索
                </button>
            </div>
        </form>
        <!-- 数据表格 -->
        <table id="userTable" lay-filter="userTable"></table>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="userTbBar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="reset">手动执行</a>
</script>

<script src="/static/admin/lib/layui-v2.5.5/layui.js" charset="utf-8"></script>

<script>
    layui.use(['layer', 'form', 'table', 'util'], function () {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var util = layui.util;

        insTb = table.render({
            elem: '#userTable'
            , url: '/api/cron'
            , toolbar: ['<p>',
                '<button lay-event="add" class="layui-btn layui-btn-sm icon-btn"><i class="layui-icon">&#xe654;</i>添加</button>&nbsp;',
                '<button lay-event="del" class="layui-btn layui-btn-sm layui-btn-danger icon-btn"><i class="layui-icon">&#xe640;</i>删除</button>',
                '</p>'].join('') //开启头部工具栏，并为其绑定左侧模板
            , defaultToolbar: ['filter', 'exports', 'print']
            , title: '定时任务'
            , cols: [[
                {type: 'checkbox', fixed: 'left'}
                , {field: 'id', title: 'ID', width: 60, fixed: 'left', unresize: true}
                , {field: 'name', title: '任务名称', width: 120}
                , {
                    field: 'pattern', title: '表达式', width: 120, templet: function (res) {
                        return '<em>' + res.pattern + '</em>'
                    }
                }
                , {
                    field: 'protocol', title: '类型', width: 80, templet: function (res) {
                        if (res.protocol === "HTTP") {
                            return '<span style="color: dodgerblue">HTTP</span>'
                        } else if (res.protocol === "SHELL") {
                            return '<span style="color: hotpink">SHELL</span>'
                        } else {
                            return ""
                        }
                    }
                }
                , {field: 'command', title: 'SHELL/URL', width: 110}
                , {field: 'method', title: 'HTTP类型', width: 100}
                , {
                    field: 'is_singleton', title: '单例', width: 60, templet: function (res) {
                        if (res.is_singleton === 1) {
                            return "是"
                        }
                        return "否"
                    }
                }
                , {
                    field: 'status', title: '状态', width: 60, templet: function (res) {
                        if (res.status === 1) {
                            return '<span style="color: green">启用</span>'
                        } else if (res.status === 0) {
                            return '<span style="color: red">禁用</span>'
                        } else {
                            return ""
                        }
                    }
                }
                , {
                    field: 'timeout', title: '超时时间', width: 100, templet: function (d) {
                        if (d.timeout === 0) {
                            return ""
                        }
                        return '<em>' + d.timeout + '秒</em>'
                    }
                }
                , {
                    field: 'retry_count', title: '重试次数', width: 100, templet: function (d) {
                        if (d.retry_count > 0) {
                            return d.retry_count
                        }
                        return ""
                    }
                }
                , {
                    field: 'retry_interval', title: '重试间隔', width: 100, templet: function (d) {
                        if (d.retry_interval === 0) {
                            return ""
                        }
                        return '<em>' + d.retry_interval + '秒</em>'
                    }
                }
                , {field: 'remark', title: '备注'}
                , {
                    field: 'create_time', title: '创建时间', width: 180, templet: function (d) {
                        if (d.create_time > 0) {
                            return util.toDateString(d.create_time * 1000)
                        }
                        return ""
                    }
                }
                , {fixed: 'right', title: '操作', toolbar: '#userTbBar', align: 'center', width: 200}
            ]]
            , page: true
        });

        /* 表格搜索 */
        form.on('submit(userTbSearch)', function (data) {
            insTb.reload({where: data.field, page: {curr: 1}});
            return false;
        });

        /* 表格头工具栏点击事件 */
        table.on('toolbar(userTable)', function (obj) {
            if (obj.event === 'add') { // 添加
                showEditModel();
            } else if (obj.event === 'del') { // 删除
                let checkRows = table.checkStatus('userTable');
                if (checkRows.data.length === 0) {
                    layer.msg('请选择要删除的用户', {icon: 2});
                    return;
                }
                let ids = checkRows.data.map(function (d) {
                    return d.id;
                });
                doDel(ids);
            }
        });
        /* 表格工具条点击事件 */
        table.on('tool(userTable)', function (obj) {
            if (obj.event === 'edit') { // 修改
                showEditModel(obj.data.id);
            } else if (obj.event === 'del') { // 删除
                doDel([obj.data.id]);
            } else if (obj.event === 'reset') { // 手动执行
                runTask(obj.data.id);
            }
        });

        function runTask(id) {
            $.ajax({
                url: "/api/cron/run",
                type: "post",
                data: {id: id},
                success: function (res) {
                    layer.msg(res.msg)
                    return false
                },
                error: function (res) {
                    layer.msg(res.msg);
                    return false
                }
            })
        }

        function showEditModel(id) {
            layer.open({
                type: 2,
                title: (id ? '修改' : '添加') + '任务',
                content: "/admin/cron/edit?id=" + id,
                area: ['600px', '820px'],
                maxmin: true
            });
        }

        function doDel(ids) {
            layer.confirm('确定删除吗?', function (index) {
                loading = layer.load(1, {shade: [0.1, '#fff']});
                $.ajax({
                    url: "/api/cron",
                    type: "DELETE",
                    data: {ids: ids},
                    success: function (res) {
                        layer.close(loading);
                        layer.close(index);
                        if (res.code === 0) {
                            layer.msg(res.msg, {time: 1000, icon: 1});
                            location.reload()
                        } else {
                            layer.msg(res.msg, {time: 1000, icon: 2});
                        }
                    },
                    error: function (res) {
                        layer.msg(res.msg);
                        return false
                    }
                })
            })
        }
    });
</script>

</body>
</html>